Add language-specific note about TypeScript decorators. #1345
Conversation
|
A live preview of this PR will be available at the URL(s) below. https://pr1345-1325f46---lit-dev-5ftespv5na-uc.a.run.app/ |
| @@ -80,3 +80,13 @@ a { | |||
| height: 1px; | |||
| overflow: hidden; | |||
| } | |||
|
|
|||
| body[code-language-preference="ts"] [code-language]:not([code-language="ts"]) { | |||
There was a problem hiding this comment.
we do have this component https://github.com/lit/lit.dev/blob/fb937bb59a9476338f1e3319565bb9701031bb67/packages/lit-dev-content/src/components/ts-js.ts but i do like the css approach better.
There was a problem hiding this comment.
Oh, I didn't see that. I had started making a new component before I looked into how switchable sample worked and figured that plain CSS was just easier.
I do think there should be a more comprehensive solution, but maybe that looks like an info icon on the samples that triggers a popover with links? |
Adds a small note to the component overview that points users to the TypeScript decorator docs.
This is hopefully a small improvement on pointing new readers towards docs that will help them enable decorators correctly. Some users get errors when copying code to their TypeScript projects because they are not enabling experimental decorators and that's what our samples use.
We would ideally note that the TypeScript samples use experimental decorators, and even have a switch between standard and experimental decorators in samples, but that's more work to do and possibly a lot of complexity if not done right. This is a small incremental fix in one place instead.
This adds the ability to have language-specific content to the site by adding selectors that hide content that doesn't match the users preferred code language.
This will only show when the user's preference is TypeScript: